import 'dart:async';

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:lcapp/api/interface/user_api.dart';
import 'package:lcapp/api/request/response_data.dart';
import 'package:lcapp/config/const_config.dart';
import 'package:lcapp/data/media_asset_data_entity.dart';
import 'package:lcapp/model/event/event_bus.dart';
import 'package:lcapp/model/oss/oss.dart';
import 'package:lcapp/model/permission/permission_operate.dart';
import 'package:lcapp/model/toast/toast.dart';
import 'package:lcapp/widget/asr_app_bar.dart';
import 'package:lcapp/widget/asr_cache_image.dart';

class MinYjfkPage extends StatefulWidget {
  const MinYjfkPage({Key? key}) : super(key: key);

  @override
  _MinYjfkPageState createState() => _MinYjfkPageState();
}

class _MinYjfkPageState extends State<MinYjfkPage> {
  List<MediaAssetDataEntity> assets = [];
  int selIndex = 1;
  late StreamSubscription _subscription;

  @override
  void initState(){
    super.initState();
    getFeedBackList();
    _subscription = eventBus.on<OssUploadState>().listen((event) {
      if (event.state == 1) {
        saveFeedBack();
      }
    });
  }

  @override
  void dispose() {
    super.dispose();
    _subscription.cancel();
  }

  getFeedBackList()async{
    ResponseData res = await UserAPI.getFeedBackList();
    if(res.code==200){

    }
  }

  saveFeedBack()async{
    Map<String,dynamic> map = {
      "feedbackType":selIndex,
      'description': titleController.text.trim(),

    };
    if(phoneController.text.trim().isNotEmpty){
      map['phone'] = phoneController.text.trim();
    }

    if(assets.isNotEmpty){
      map['images']=assets.map((e) => e.url).toList();
    }
    showLoading();
    ResponseData res = await UserAPI.saveFeedBack(map);
    hideLoading();
    if(res.code==200){
      showToast("反馈成功~");
      Navigator.of(context).pop();
    }
  }

  getImage(){
    // getAlbumPermission(context, ()async{
    //   List<MediaAssetDataEntity> res = await AsrMediaPicker.pickImg(
    //     showCamera: true,selectCount: 4);
    //   if(res!=null){
    //     setState(() {
    //       assets.addAll(res);
    //     });
    //   }
    // });
  }

  TextEditingController titleController = TextEditingController();
  TextEditingController phoneController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: bgColor,
      appBar: AsrAppBar(
        backgroundColor: defaultBarColor,
        barColor: Colors.white,
        titleText: '意见反馈',
      ),
      body: GestureDetector(
        onTap: (){
          FocusScope.of(context).requestFocus(FocusNode());
        },
        child: Container(
          child: SingleChildScrollView(
            child: Column(
              children: [
                Container(
                  margin: EdgeInsets.symmetric(vertical: 30.w),
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  child: Row(
                    children: [
                      Container(width: 5,height: 30.w,color: Color(0xffFF7916),),
                      SizedBox(width: 20.w,),
                      Text('反馈类型',style: TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.w600,
                          fontSize: 34.sp
                      ),),
                    ],
                  ),
                ),
                Container(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      GestureDetector(
                        onTap: (){
                          setState(() {
                            selIndex=1;
                          });
                        },
                        child: Stack(
                          children: [
                            Image.asset(
                              selIndex == 1
                                  ? 'assets/min/min_hjb.png'
                                  : 'assets/min/min_hjb_un.png',
                              fit: BoxFit.fill,
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                            ),
                            Container(
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                              alignment: Alignment.center,
                              child: Text('缺陷反馈',style: TextStyle(
                                  color: selIndex==1? Color(0xffE8850B):Colors.grey,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 28.sp
                              ),),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(width: 10.w,),
                      GestureDetector(
                        onTap: (){
                          setState(() {
                            selIndex=2;
                          });
                        },
                        child: Stack(
                          children: [
                            Image.asset(
                              selIndex == 2
                                  ? 'assets/min/min_hjb.png'
                                  : 'assets/min/min_hjb_un.png',
                              fit: BoxFit.fill,
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                            ),
                            Container(
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                              alignment: Alignment.center,
                              child: Text('功能建议',style: TextStyle(
                                  color: selIndex==2? Color(0xffE8850B):Colors.grey,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 28.sp
                              ),),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(width: 10.w,),
                      GestureDetector(
                        onTap: (){
                          setState(() {
                            selIndex=3;
                          });
                        },
                        child: Stack(
                          children: [
                            Image.asset(
                              selIndex == 3
                                  ? 'assets/min/min_hjb.png'
                                  : 'assets/min/min_hjb_un.png',
                              fit: BoxFit.fill,
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                            ),
                            Container(
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                              alignment: Alignment.center,
                              child: Text('投诉',style: TextStyle(
                                  color: selIndex==3? Color(0xffE8850B):Colors.grey,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 28.sp
                              ),),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(width: 10.w,),
                      GestureDetector(
                        onTap: (){
                          setState(() {
                            selIndex=4;
                          });
                        },
                        child: Stack(
                          children: [
                            Image.asset(
                              selIndex == 4
                                  ? 'assets/min/min_hjb.png'
                                  : 'assets/min/min_hjb_un.png',
                              fit: BoxFit.fill,
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                            ),
                            Container(
                              width: (1.sw-60.w-33.w)/4,
                              height: 90.w,
                              alignment: Alignment.center,
                              child: Text('其他',style: TextStyle(
                                  color: selIndex==4? Color(0xffE8850B):Colors.grey,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 28.sp
                              ),),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(top: 30.w),
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  child: Row(
                    children: [
                      Container(width: 5,height: 30.w,color: Color(0xffFF7916),),
                      SizedBox(width: 20.w,),
                      Text('问题描述',style: TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.w600,
                          fontSize: 34.sp
                      ),),
                    ],
                  ),
                ),
                Container(
                  height: 200.w,
                  child: TextField(
                    controller: titleController,
                    maxLines: null,
                    keyboardType: TextInputType.multiline,
                    style: TextStyle(
                        fontSize: 30.sp
                    ),
                    decoration:  InputDecoration(
                      contentPadding: EdgeInsets.symmetric(horizontal: 30.w),
                      hintText: "请输入您的问题或建议...",
                      hintStyle: TextStyle(
                        color: const Color(0xFF7F7F7F),
                        fontSize: 30.sp,
                        fontWeight: FontWeight.w500,
                      ),
                      counterText: "",
                      border: const OutlineInputBorder(
                        borderSide: BorderSide.none,
                      ),
                      fillColor: Colors.transparent,
                      filled: true,
                    ),
                  ),
                ),
                Container(
                  height: 260.w,
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  margin: EdgeInsets.only(top: 30.w),
                  child: ListView.builder(
                      scrollDirection: Axis.horizontal,
                      itemCount: assets.length+1,
                      itemBuilder: (context,index){
                        if(index==assets.length){
                          return GestureDetector(
                            onTap: (){
                              FocusScope.of(context).requestFocus(FocusNode());
                              getImage();
                            },
                            child: ClipRRect(
                              borderRadius: BorderRadius.circular(10.w),
                              child: Container(
                                margin: EdgeInsets.only(right: 20.w),
                                width: 240.w,
                                height: 240.w,
                                color: Colors.white,
                                alignment: Alignment.center,
                                child: Image.asset(
                                  'assets/fabu/fabu_add.png',
                                  width: 80.w,
                                  height: 80.w,
                                  fit: BoxFit.fitWidth,
                                ),
                              ),
                            ),
                          );
                        }
                        return ClipRRect(
                          borderRadius: BorderRadius.circular(10.w),
                          child: Container(
                            margin: EdgeInsets.only(right: 20.w),
                            width: 240.w,
                            height: 240.w,
                            color: Colors.white,
                            child: Stack(
                              children: [
                                Positioned(child: GestureDetector(
                                  onTap: (){

                                  },
                                  child: ASRCacheImage(
                                    image: assets[index].uri!,
                                    fit: BoxFit.cover,
                                  ),
                                ),left: 0,right: 0,top: 0,bottom: 0,),
                                Positioned(child: GestureDetector(
                                  onTap: (){
                                    FocusScope.of(context).requestFocus(FocusNode());
                                    setState(() {
                                      assets.removeAt(index);
                                    });
                                  },
                                  child: Image.asset('assets/home/home_share_close.png',width: 40.w,),
                                ),right: 0,)
                              ],
                            ),
                          ),
                        );
                      }
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(top: 30.w),
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  child: Row(
                    children: [
                      Container(width: 5,height: 30.w,color: Color(0xffFF7916),),
                      SizedBox(width: 20.w,),
                      Text('联系方式',style: TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.w600,
                          fontSize: 34.sp
                      ),),
                    ],
                  ),
                ),
                Container(
                  height: 85.w,
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(85.w)
                  ),
                  margin: EdgeInsets.symmetric(horizontal: 60.w,vertical: 30.w),
                  child: TextField(
                    controller: phoneController,
                    maxLines: 1,
                    maxLength: 11,
                    keyboardType: TextInputType.phone,
                    style: TextStyle(
                        fontSize: 24.sp
                    ),
                    decoration:  InputDecoration(
                      contentPadding: EdgeInsets.symmetric(horizontal: 30.w),
                      hintText: "选填，请输入手机号，便于后续与您联系",
                      hintStyle: TextStyle(
                        color: const Color(0xFF7F7F7F),
                        fontSize: 24.sp,
                        fontWeight: FontWeight.w500,
                      ),
                      counterText: "",
                      border: const OutlineInputBorder(
                        borderSide: BorderSide.none,
                      ),
                      fillColor: Colors.transparent,
                      filled: true,
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: (){
                    if(titleController.text.trim().isEmpty){
                      showToast('请完善问题描述和联系方式');
                      return;
                    }
                    if(assets.isNotEmpty){
                      // AsrOss.ossUploadVideo(assets);
                    }else{
                      saveFeedBack();
                    }
                  },
                  child: Container(
                    margin: EdgeInsets.symmetric(vertical: 40.w),
                    padding: EdgeInsets.symmetric(horizontal: 30.w),
                    child: Container(
                      height: 80.w,
                      width: 1.sw-60.w,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                          color: Color(0xffFA6E28),
                          borderRadius: BorderRadius.circular(80.w)
                      ),
                      child: Text('确认提交',style: TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.w600,
                          fontSize: 34.sp
                      ),),
                    ),
                  ),
                ),
                Container(
                  child: RichText(
                    maxLines: 2,
                    softWrap: true,
                    text: TextSpan(
                      text: '客服电话',
                      style: TextStyle(
                        fontSize: 24.w,
                        color: Colors.black,
                        fontWeight: FontWeight.w600
                      ),
                      children: <TextSpan>[
                        TextSpan(
                          text: '  400-562-4569',
                          style:  TextStyle(
                            color: const Color(0xffFA6E28),
                            fontSize: 24.w,
                          ),
                          recognizer: TapGestureRecognizer()
                            ..onTap = () {

                            },
                        ),
                      ],
                    ),
                    textAlign: TextAlign.left,
                  ),
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}
